<template>
  <!-- 商品规格组件 -->
  <van-action-sheet
    class="sku"
    v-model:show="show"
    title="标题"
    :round="false"
    @cancel="$emit('close')"
    @click-overlay="$emit('close')"
  >
    <van-row class="quantity" type="flex" align="center">
      <van-button icon="minus" color="#eee" size="mini" @click="num ? num-- : 0" />
      <span>{{ num }}</span>
      <van-button icon="plus" color="#eee" size="mini" @click="num++" />
    </van-row>
    <van-button type="success" size="small" block @click="saveCard">Done</van-button>
  </van-action-sheet>
</template>
<script>
import { mapMutations } from "vuex"

export default {
  name: "Sku",
  props: {
    // 是否显示规格弹层
    showSku: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      num: 1,
    }
  },
  computed: {
    show: {
      get() {
        return this.showSku
      },
      set() { },
    }
  },
  methods: {
    ...mapMutations('card', ['setNum']),
    saveCard() {
      this.setNum(this.num)
      this.$emit('close')
    },
  },
}
</script>
<style lang="scss" scoped>
// .sku {
// }
</style>